const path = require("path");
const CompressionPlugin = require('compression-webpack-plugin');
const productionGzipExtensions = ['js', 'css'];
// const productionGzipExtensions = /\.(js|css|json|txt|html|ico|svg)(\?.*)?$/i;

function resolve(dir) {
  return path.join(__dirname, dir);
}

module.exports = {
  // 部署应用包时的基本url
  publicPath: process.env.NODE_ENV === 'production' ? '/online/' : './on',
  //当运行 vue-cli-service build 时生成的生产环境构建文件的目录
  outputDir: 'dist',
  //放置生成的静态资源 (js、css、img、fonts) 的 (相对于 outputDir 的) 目录
  assetsDir: 'assets',
  // eslint-loader 是否在保存的时候检查 安装@vue/cli-plugin-eslint有效
  lintOnSave: true,
  //是否使用包含运行时编译器的 Vue 构建版本。设置true后你就可以在使用template
  runtimeCompiler: true,
  // 生产环境是否生成 sourceMap 文件 sourceMap的详解请看末尾  
  productionSourceMap: false,
  configureWebpack: config => {
    if (process.env.NODE_ENV === 'production') {
      return {
        plugins: [new CompressionPlugin({
          filename: '[path].gzip[query]',
          // test: /\.js$|\.html$|\.css/, // 匹配文件名
          test: new RegExp('\\.(' + productionGzipExtensions.join('|') + ')$'),
          algorithm: 'gzip',
          threshold: 10240, // 对超过10k的数据进行压缩
          deleteOriginalAssets: false, // 是否删除源文件
          minRatio: 0.8
        })]
      }
    } else {
      // 为开发环境修改配置...
    }
  },
  chainWebpack: config => {
    config.resolve.symlinks(true);
    config.resolve.alias.set("@", resolve("src"));
  },
  // css 相关配置
  css: {
    // 是否使用css分离插件 ExtractTextPlugin 生产环境下是true,开发环境下是false
    // extract: true,
    // 开启 CSS source maps?
    // sourceMap: false,
    // css预设器配置项
    loaderOptions: {
      sass: {
        // data: `@import "~@/assets/css/variable.scss";@import "~@/assets/css/mixin.scss";`
      }
    },
    // 启用 CSS modules for all css / pre-processor files.
    // modules: false
  },
  // webpack-dev-server 相关配置
  devServer: { // 设置代理
    hot: true, // 热加载
    host: '0.0.0.0', // ip地址
    port: '3000', // 端口
    // https: false, //false关闭https，true为开启
    // open: true, //自动打开浏览器
    proxy: {
      // ...JSON.parse(process.env.PROXY_CONFIG || '[]').reduce((result, [key, url]) => {
      //   result[ `${key}/` ] = {
      //     target: url,
      //     changeOrigin: true,
      //     pathRewrite: {
      //       [ `^${key}/` ]: `${key}/`
      //     }
      //   }
      //   return result
      // }, {}),
      "/api": {
        target: "http://localhost:3000"
      }
    }
  },
  pluginOptions: { // 第三方插件配置
    electronBuilder: {
      productName: "贴吧"
    }
  }
};
